/*
Button style
*/
.btn{
    font-size: 14px;
    text-transform: capitalize;
    font-weight: 400;
    @include border-radius(0px);
      border: 1px solid;
      &.rounded{
          @include border-radius(20px);
      }
       &.btn-circle{
          @include border-radius(50%);
          padding: 0px;
          display: inline-block;
      }
}
.btn-icon{
    padding: 0px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    text-align: center;
    &.btn-lg{
       padding: 0px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px; 
    }
     &.btn-xl{
       padding: 0px;
    width: 70px;
    height: 70px;
    line-height: 70px;
    font-size: 34px; 
    }
}

.btn-sm{
    font-size: 12px;
}
.btn-xs{
    font-size: 12px;
}
.btn-link{
    color: $color-primary;
}
.btn-default{
     border: 1px solid rgba(197,214,222,.7); 
    background-color: #f5f5f5;
    &:hover{
       border: 1px solid rgba(197,214,222,.7);   
    }
    &.btn-border{
        background-color: transparent;
        color: #666;
        border: 1px solid rgba(197,214,222,.7);
        &:hover{
            background-color: #f5f5f5;
            color: #666;
        }
    }
}
.btn-primary{
    background-color:$bg-primary;
    border-color: $bg-primary;
    color:#fff;
    &.btn-border{
        background-color: transparent;
        color: $color-primary;
        border: 1px solid $color-primary;
        &:hover{
            background-color: $bg-primary;
            color: #fff;
        }
    }
}
.btn-success{
    background-color:$bg-success;
    border-color: $bg-success;
    color:#fff;
      &.btn-border{
        background-color: transparent;
        color: $color-success;
        border: 1px solid $color-success;
        &:hover{
            background-color: $bg-success;
            color: #fff;
        }
    }
}
.btn-warning{
    background-color:$bg-warning;
    border-color:$bg-warning; 
    color:#fff;
       &.btn-border{
        background-color: transparent;
        color: $color-warning;
        border: 1px solid $color-warning;
        &:hover{
            background-color: $bg-warning;
            color: #fff;
        }
    }
}
.btn-danger{
    background-color:$bg-danger;
    border-color: $bg-danger;
    color:#fff;
    &.btn-border{
        background-color: transparent;
        color: $color-danger;
        border: 1px solid $color-danger;
        &:hover{
            background-color: $bg-danger;
            color: #fff;
        }
    }
}
.btn-info{
    background-color:$bg-info;
    border-color: $bg-info;
    color:#fff;
      &.btn-border{
        background-color: transparent;
        color: $color-info;
        border: 1px solid $color-info;
        &:hover{
            background-color: $bg-info;
            color: #fff;
        }
    }
}

.btn-facebook {
  color: #ffffff !important;
  background-color: #3b5998 !important;
}
.btn-twitter {
  color: #ffffff !important;
  background-color: #55acee !important;
}
.btn-linkedin {
  color: #ffffff !important;
  background-color: #007bb6 !important;
}
.btn-dribbble {
  color: #ffffff !important;
  background-color: #ea4c89 !important;
}
.btn-googleplus {
  color: #ffffff !important;
  background-color: #dd4b39 !important;
}
.btn-instagram {
  color: #ffffff !important;
  background-color: #3f729b !important;
}
.btn-pinterest {
  color: #ffffff !important;
  background-color: #cb2027 !important;
}
.btn-dropbox {
  color: #ffffff !important;
  background-color: #007ee5 !important;
}
.btn-flickr {
  color: #ffffff !important;
  background-color: #ff0084 !important;
}
.btn-tumblr {
  color: #ffffff !important;
  background-color: #32506d !important;
}
.btn-skype {
  color: #ffffff !important;
  background-color: #00aff0 !important;
}
.btn-youtube {
  color: #ffffff !important;
  background-color: #bb0000 !important;
}
.btn-github {
  color: #ffffff !important;
  background-color: #171515 !important;
}
.ui-buttons{
    .btn{
       margin: 2px; 
    }
}